<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <path
      d="M18.9645 4.5H11.8199C11.6029 4.50072 11.3906 4.43545 11.2099 4.3125L9.93578 3.4411C9.51387 3.15254 9.01753 2.99899 8.50998 3.00001H5.03188C4.35142 3.00075 3.69903 3.27755 3.21787 3.76967C2.73671 4.26179 2.46608 4.92904 2.46535 5.625V6.75H21.531C21.531 5.3025 20.3797 4.5 18.9645 4.5Z"
      fill="#7A7A7A" />
    <path
      d="M19.6863 21H4.31004C3.63661 20.9992 2.99046 20.7278 2.51093 20.2441C2.03141 19.7605 1.75695 19.1035 1.74672 18.4148L1.00701 10.6927V10.6795C0.982791 10.37 1.02146 10.0587 1.1206 9.76527C1.21973 9.47179 1.37718 9.20248 1.58304 8.97427C1.7889 8.74607 2.03871 8.56391 2.31676 8.43926C2.5948 8.31462 2.89506 8.25018 3.19865 8.25H20.8023C21.1058 8.25031 21.4059 8.31484 21.6839 8.43954C21.9618 8.56425 22.2115 8.74642 22.4173 8.97461C22.623 9.20281 22.7804 9.47207 22.8795 9.76549C22.9786 10.0589 23.0172 10.3701 22.993 10.6795V10.6927L22.2496 18.4148C22.2394 19.1035 21.9649 19.7605 21.4854 20.2441C21.0059 20.7278 20.3597 20.9992 19.6863 21Z"
      :fill="color" />
    <circle cx="12" cy="14.5957" r="4.5" fill="white" />
    <path
      d="M12 12V14.5L14 16.5"
      stroke="#CBCBCB"
      stroke-width="2"
      stroke-linecap="round"
      stroke-linejoin="round" />
  </svg>
</template>

<script setup lang="ts">
  interface Props {
    size?: number | string;
    color?: string;
    fill?: string;
    strokeWidth?: number | string;
    iconClass?: string;
  }

  withDefaults(defineProps<Props>(), {
    size: 24,
    color: '#7A7A7A',
    fill: 'none',
    strokeWidth: 1,
    iconClass: '',
  });
</script>
